<?php
	function Graph ($Name, $Height = 200, $Width = 320, $Options = '') {
		$Width = ($Width) ? "width:{$Width}px;" : '';
		$Height = ($Height) ? "height:{$Height}px;" : '';
		echo ("<td $Options style='{$Width}{$Height}'><a href='graph.php?name=$Name'><img class='graph' type='Preview' src='' alt='$Name' /></a></td>");
	}
?><html>
	<head>
		<title>overwatch: all your server are belong to us</title>
		<link rel="stylesheet" type="text/css" href="style/style.css" />
		<script type="text/javascript">window.onload = function () {
			function GatherGraphs () {
				var Result = new Array
				var Imgs = document.getElementsByTagName ('img')
				for (var i = 0; i < Imgs.length; i += 1) {
					var Classes = Imgs [i].className.trim ().split (/,+\s+|,+|\s+/)
					for (var j = 0; j < Classes.length; j += 1) if ('graph' == Classes [j].toLowerCase () && Imgs [i].alt.length) {
						Result.push (Imgs [i])
						break
					}
				}
				return (Result)
			}
			Images = GatherGraphs ()

			Hosts = document.getElementById ('hosts')
			Hosts.Update = function (Data) {
				var Body = this.childNodes [1]
				while (Body.childNodes.length) Body.removeChild (Body.childNodes [0])
				var Uptimes = new Array
				for (var i in Data) Uptimes.push ([i, Data [i]])
				Uptimes.sort (function (a, b) {
					a1 = parseInt (a [1])
					b1 = parseInt (b [1])
					if (a1 < b1) return (1)
					if (a1 > b1) return (-1)
					return (0)
				})
				for (var i = 0; i < Uptimes.length; i += 1) {
					var Uptime = new Object
					Uptime.days = Math.floor (Uptimes [i][1] / 86400)
					Uptime.hours = Math.floor ((Uptimes [i][1] - Uptime.days * 86400) / 3600)
					var Row = document.createElement ('tr')
					var Host = document.createElement ('th')
					Host.appendChild (document.createTextNode (Uptimes [i][0]))
					var UDays = document.createElement ('td')
					UDays.appendChild (document.createTextNode (Uptime.days + ' d'))
					var UHours = document.createElement ('td')
					UHours.appendChild (document.createTextNode (Uptime.hours + ' h'))
					Row.appendChild (Host)
					Row.appendChild (UDays)
					Row.appendChild (UHours)
					Body.appendChild (Row)
				}
			}
			Status = document.getElementById ('status')
			Known = document.getElementById ('known')
			Unknown = document.getElementById ('unknown')
			Req = new XMLHttpRequest
			Req.Handler = function () {
				if (this.readyState >= 4) {
					if (this.status == 200) {
						var Reply = JSON.parse (this.responseText)
					} else var Reply = {
						known: "ERROR",
						unknown: "ERROR",
					}
					Known.firstChild.nodeValue = Reply.known
					Unknown.firstChild.nodeValue = Reply.unknown
					if ('hosts' in Reply) Hosts.Update (Reply.hosts)
					Status.className = (parseInt (Reply.known) || parseInt (Reply.unknown)) ? 'red' : 'green';
				}
			}
			Req_Update = function () {
				Req.open ('GET', 'req.php')
				Req.onreadystatechange = Req.Handler
				Req.send (null)
			}
			Req_Update ()
			Req.Interval = window.setInterval (Req_Update, 5000)

			Head = document.getElementsByTagName ('head') [0]
			Head.Loaded = new Object
			Head.Load = function (Name) {
				if (! this.Loaded [Name]) {
					var Script = document.createElement ('script')
					Script.type = 'text/javascript'
					Script.src = 'js/' + Name + '.js'
					this.appendChild (Script)
					this.Loaded [Name] = true
				} else alert (Name);
			}
			Head.Load ('common')
		}</script>
	</head>
	<body class="scanner">
		<div id="filter">&nbsp;</div>
		<table id="graphs"><thead>
			<tr id="status" class="">
				<td colspan="5">
					OVERWATCH STATUS:
					<span id="known">n/a</span>
					known and
					<span id="unknown">n/a</span>
					unknown <a href="log.php">log lines</a>
				</td>
			</tr>
		</thead><tbody>
			<tr>
				<td>&nbsp;</td>
				<?php Graph ('Load'); ?>
				<td>&nbsp;</td>
				<?php Graph ('Sovintel'); ?>
				<td>&nbsp;</td>
			</tr>
			<tr>
				<td>&nbsp;</td>
				<?php Graph ('Temperatures'); ?>
				<td>&nbsp;</td>
				<?php Graph ('SovintelQueues'); ?>
				<td>&nbsp;</td>
			</tr>
			<tr>
				<td>&nbsp;</td>
				<?php Graph ('CPUFreq', 200, 320, 'rowspan="2"'); ?>
				<?php Graph ('Swap', 100); ?>
				<?php Graph ('States', 100); ?>
				<td>&nbsp;</td>
			</tr>
			<tr>
				<td>&nbsp;</td>
				<?php Graph ('APC', 100); ?>
				<?php Graph ('SovintelPackets', 100); ?>
				<td>&nbsp;</td>
			</tr>
		</tbody></table>
		<table id="hosts"><thead><tr><th colspan="3">host uptimes</th></tr></thead><tbody><tr><th>host</th><td>n/a d</td><td>n/a h</td></tr></tbody></table>
	</body>
</html>